Docz も中で Webpack を使ってビルドしたりしていますが、自分のコンポーネントが自分の Webpack 設定依存の箇所を持っているとそのままだと Docz が使えなかったりします。
Docz の Webpack 設定を修正する
これには設定ファイルのdoczrc.js
でmodifyBundlerConfig
という関数を設定してエクスポートします。これは第一引数に Docz の Webpack 設定を渡してくれるので、その設定オブジェクトを自分好みにした後それを返します。
例えば僕の場合webpack.DefinePlugin
の内容に依存しているということがありました。その時設定ファイルはこのようになりました。
const webpack = require('webpack');
module.exports = {
title: 'サイトのタイトル',
modifyBundlerConfig: config => {
config.plugins.push(new webpack.DefinePlugin({
'何かプロパティ': JSON.stringify('何か値')
}))
return config;
},
};